<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :span="24">
            <a-breadcrumb>
              <a-breadcrumb-item href="">
                <a-icon type="home" />
                <span>首页</span>
              </a-breadcrumb-item>
              <a-breadcrumb-item href="">
                <a-icon type="user" />
                <span>接收入库管理</span>
              </a-breadcrumb-item>
              <a-breadcrumb-item href="">
                <span>
                <template v-if="this.id !== ''"> <a-icon type="edit" />接收入库编辑</template>
                  <template v-else> <a-icon type="folder-add" />接收入库添加</template>
                </span>
              </a-breadcrumb-item>
            </a-breadcrumb>
          </a-col>
          <a-col :span="24">&nbsp;</a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    <div class="table-page-search-wrapper">
      <a-form-model :model="formData">
        <a-row :gutter="24">
          <a-col :span="16">
            <a-form-item label="" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-button-group>
                <a-button type="primary" @click="goBack"> <a-icon type="left" />返回 </a-button>
              </a-button-group>
            </a-form-item>
          </a-col>
          <a-col :span="8" :style="{ textAlign: 'right' }">
            <a-form-item>
              <a-button-group>
                <a-button type="primary" @click="toInStorage"> <a-icon type="left" />选择入库明细 </a-button>
                <a-button type="primary" @click="toOutStorage">选择退库明细 <a-icon type="right" /></a-button>
              </a-button-group>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-model-item style="display: none;width:0px;" :labelCol="labelCol" :wrapperCol="wrapperCol"  label="id">
              <a-input v-model="formData.id" />
            </a-form-model-item>
            <a-form-item label="质检单编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.qualityCode" :disabled="disabledOne" placeholder="请输入质检单编号"></a-input>
            </a-form-item>
            <a-form-model-item label="质检单名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.qualityName" :disabled="disabledOne" placeholder="请输入质检单名称"></a-input>
            </a-form-model-item>
            <a-form-model-item label="订单编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.orderCode"  :disabled="disabledOne" placeholder="请输入订单编号"></a-input>
            </a-form-model-item>
            <a-form-model-item label="订单名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.orderName"  :disabled="disabledOne" placeholder="请输入订单名称"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="供货商编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.supplierCode" readOnly  :disabled="disabledOne" placeholder="请输入供货商编号" >
              </a-input>
            </a-form-model-item>
            <a-form-model-item label="供货商名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.supplierName" :disabled="disabledOne" placeholder="请输入供货商名称"></a-input>
            </a-form-model-item>
            <a-form-model-item label="创建人" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.createBy" :disabled="disabledOne" placeholder="请输入创建人"></a-input>
            </a-form-model-item>
            <a-form-model-item label="创建日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-date placeholder="请选择创建日期" v-model="formData.createTime" showTime
                      :dateFormat="dateFormat" :disabled="disabledOne" style="width: 100%"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="总数量" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.totalNum" :disabled="disabledOne" placeholder="请输入总数量"></a-input>
            </a-form-model-item>
            <a-form-model-item label="总金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.totalPrice" :disabled="disabledOne" placeholder="请输入总金额"></a-input>
            </a-form-model-item>
            <a-form-model-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-model="formData.status" :disabled="disabledOne" placeholder="请输入状态"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </div>

    <!-- 操作按钮区域 -->
    <div class="table-operator">
    </div>

    <!-- table区域-begin -->
    <div>
      <div v-for="i in tableCount" >
      {{tableTitle[i-1]}}
      <a-table :ref="'table_' + (i-1)"
               size="middle"
               bordered
               rowKey="id"
               :columns="columns[i-1]"
               :data-source="dataSource[i-1]"
               :pagination="ipagination[i-1]"
               :loading="loading[i-1]"
               @change="handleTableChange"
               >
      </a-table>
      </div>
    </div>

    <mms-wz-purchase-quality-details-modal ref="modalForm" @ok="modalFormOk"></mms-wz-purchase-quality-details-modal>
    <mms-in-storage-modal ref="inStorageModalForm" @ok="inStorageModalFormOk"></mms-in-storage-modal>
    <mms-out-storage-modal ref="outStorageModalForm" @ok="outStorageModalFormOk"></mms-out-storage-modal>
  </a-card>
</template>

<script>

  import '@/assets/less/TableExpand.less'
  import { mixinDevice } from '@lone/lone-vue/src/utils/mixin'
  import { MultiListMixin } from '@lone/lone-vue/src/mixins/MultiListMixin'
  import MmsWzPurchaseQualityDetailsModal from './modules/MmsWzPurchaseQualityDetailsModal'
  import JDate from '@lone/lone-vue/src/components/jeecg/JDate'
  import { postAction, putAction, deleteAction, getAction } from '@lone/lone-vue/src/api/manage'
  import Vue from 'vue'
  import MmsInStorageModal from '../base/form/MmsInStorageModal'
  import MmsOutStorageModal from '../base/form/MmsOutStorageModal'

  export default {
    name: 'MmsWzPurchaseReceiveDetailsList',
    mixins:[MultiListMixin, mixinDevice],
    components: {
      JDate,
      MmsWzPurchaseQualityDetailsModal,
      MmsInStorageModal,
      MmsOutStorageModal
    },
    props:{
      //判断是编辑还是新增
      status:{
        type:String,
        required:false
      },
      //判断是编辑Id
      id:{
        type:String,
        required:false
      },
    },
    watch:{
      status: {
        handler(newVal, oldVal) {
          this.resize()
          this.loadFormData()
        },
        immediate: true
      }
    },
    data () {
      return {
        description: 'mms_wz_purchase_quality_details管理页面',
        top: 10,
        dateFormat: 'YYYY-MM-DD HH:mm:ss',
        // 表头
        disabledAll: false,
        disabledOne: false,
        editingKey: '',
        model: {},
        form: this.$form.createForm(this),
        confirmLoading: false,
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 18 }
        },
        tableCount: 2,
        tableTitle: ['接收明细', '入库明细'],
        // 表头
        columns: [
          [
            {
              title: '#',
              dataIndex: '',
              key:'rowIndex',
              align:"center",
              customRender:function (t,r,index) {
                return parseInt(index)+1;
              }
            },
            {
              title:'物资编码',
              align:"center",
              dataIndex: 'materialCode'
            },
            {
              title:'物资名称',
              align:"center",
              dataIndex: 'materialName'
            },
            {
              title:'规格',
              align:"center",
              dataIndex: 'specs'
            },
            {
              title:'型号',
              align:"center",
              dataIndex: 'model'
            },
            {
              title:'计量单位',
              align:"center",
              dataIndex: 'unit'
            },
            {
              title:'到货数量',
              align:"center",
              dataIndex: 'inDt'
            },
            {
              title:'入库数量',
              align:"center",
              dataIndex: 'inNum'
            },
            {
              title:'单价',
              align:"center",
              dataIndex: 'price'
            },
            {
              title:'仓库',
              align:"center",
              dataIndex: 'warehouseCode'
            },
            {
              title:'货仓',
              align:"center",
              dataIndex: 'warehouse'
            },
            {
              title:'批次',
              align:"center",
              dataIndex: 'batch'
            }
          ],
          [
            {
              title: '#',
              dataIndex: '',
              key:'rowIndex',
              align:"center",
              customRender:function (t,r,index) {
                return parseInt(index)+1;
              }
            },
            {
              title:'物资编码',
              align:"center",
              dataIndex: 'materialCode'
            },
            {
              title:'物资名称',
              align:"center",
              dataIndex: 'materialName'
            },
            {
              title:'规格',
              align:"center",
              dataIndex: 'specs'
            },
            {
              title:'型号',
              align:"center",
              dataIndex: 'model'
            },
            {
              title:'计量单位',
              align:"center",
              dataIndex: 'unit'
            },
            {
              title:'到货数量',
              align:"center",
              dataIndex: 'currentArrivalNum'
            },
            {
              title:'合格数量',
              align:"center",
              dataIndex: 'qualifiedNum'
            },
            {
              title:'单价',
              align:"center",
              dataIndex: 'price'
            },
            {
              title:'总金额',
              align:"center",
              dataIndex: 'totalPrice'
            }
          ]
        ],
        dataSource: [[], []],
        formData:{},
        url: {
          list: ["/cg/mmsWzPurchaseReceive/listByQualityId", "/cg/mmsWzPurchaseReceive/receivePageList"],
          delete: ["/cg/mmsWzPurchaseQualityDetails/delete", "/cg/mmsWzPurchaseQualityDetails/delete"],
          deleteBatch: ["/cg/mmsWzPurchaseQualityDetails/deleteBatch", "/cg/mmsWzPurchaseQualityDetails/deleteBatch"],
          exportXlsUrl: ["/cg/mmsWzPurchaseQualityDetails/exportXls", "/cg/mmsWzPurchaseQualityDetails/exportXls"],
          importExcelUrl: ["cg/mmsWzPurchaseQualityDetails/importExcel", "/cg/mmsWzPurchaseQualityDetails/importExcel"],
        },
        dictOptions:{},
      }
    },
    created() {
    },
    computed: {
      importExcelUrl: function(){
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
      },
    },
    methods: {
      loadFormData() {
        let that = this;
        for(let i in this.queryParam){
          this.queryParam[i].qualityId = this.id;
        }
        this.$set(this.formData, 'createTime', Vue.prototype.$formatDate());
        this.$set(this.formData, 'status', '新建');
        getAction('/base/mmsMaterialCode/getUserInfo', {}).then((res) => {
          if (res.success) {
            let result = res.result;
            if(result){
              this.$set(this.formData, 'createBy', result['realname']);
            }
          }
        })
        if(this.id !== '@ADD@'){
          let paramsObject = {id: this.id};
          getAction('/cg/mmsWzPurchaseQuality/queryById', paramsObject).then((res) => {
            if (res.success) {
              let result = res.result;
              if (result) {
                for(let p in result) {
                  if(p === 'details'){
                    const records = result[p];
                    for(let r in records){
                      let newData = records[r];
                    }
                  }else{
                    this.$set(this.formData, p, result[p]);
                  }
                }
              }
            }
          });
        }
        that.disabledOne = true;
      },
      toOutStorage(){
        this.$refs.outStorageModalForm.showInfo(this.id);
      },
      toInStorage(){
        this.$refs.inStorageModalForm.showInfo(this.id);
      },
      inStorageModalFormOk(records){
        let that = this, paramsObject = {receives: records}, id = that.id;
        this.$set(paramsObject, 'id', id);
        this.$set(paramsObject, 'orderCode', this.formData['orderCode'])
        postAction('cg/mmsWzPurchaseReceive/receive', paramsObject).then((res) => {
          if (res.success) {
            this.$message.success(res.message);
            // this.$emit('ok');
            let result = res.result;
            if (result) {
              that.redirect(id)
            }
          } else {
            this.$message.warning(res.message);
            that.redirect(id)
          }
        }).finally(() => {
        })
      },
      outStorageModalFormOk(records){

      },
      redirect(id){
        let that = this;
        that.$emit("prevStep");
        that.$emit("nextStep",{id:id,status: ''})
      },
      goBack(){
        this.$emit('prevStep')
      },
      initDictConfig(){
      }
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
</style>